<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
<ui:composition template="template.xhtml">
	<ui:define name="content">
		<h:form>
			<p:growl id="msg" showDetail="true" escape="false" />

			<h3 style="margin-top: 0">Basic PickList</h3>
			<p:pickList id="pickList" value="#{pickListView.cities}" var="cities"
				itemLabel="#{cities}" itemValue="#{cities}" />

			<p:commandButton id="citySubmit" value="Submit"
				update="displayCities" oncomplete="PF('cityDialog').show()"
				style="margin-top:5px" />

			<h3>PickList on Steroids: Pojo Support with Effect, Captions,
				Custom Content, Reordering, Filtering, Checkboxes and Ajax Transfer</h3>


			<p:dialog showEffect="fade" hideEffect="fade"
				widgetVar="cityDialog">
				<h:panelGrid id="displayCities" columns="2">
					<h:outputText value="Source: " style="font-weight:bold" />
					<ui:repeat value="#{pickListView.cities.source}" var="item">
						<h:outputText value="#{item}" style="margin-right:5px" />
					</ui:repeat>

					<h:outputText value="Target: " style="font-weight:bold" />
					<ui:repeat value="#{pickListView.cities.target}" var="item">
						<h:outputText value="#{item}" style="margin-right:5px" />
					</ui:repeat>
				</h:panelGrid>
			</p:dialog>


		</h:form>
	</ui:define>
</ui:composition>
</html>